<template>
  <div>
    <!-- <input type="text" v-model="msg"> -->
    <!-- <input type="text" :value="msg" @input="msg = $event.target.value">
    <p>{{msg}}</p> -->
    <!-- <br> -->
    <MyInput v-model="abc"></MyInput>
    <p>{{abc}}</p>
    <hr>
    <MyCeshi v-model="money" ref="abc"></MyCeshi>
    <hr>
    <button @click="fn">按钮</button>
    <div ref="bcd">123</div>
    
  </div>
</template>

<script>
import MyInput from './components/my-input.vue'
import MyCeshi from './components/my-ceshi.vue'

export default {
  data(){
    return {
      msg: 'hello world',
      abc: 'hi',
      money: 100
    }
  },
  methods: {
    fn() {
      console.log(this.$refs);
      console.log(this.$refs.abc);
      console.log(this.$refs.bcd);
    }
  },
  components: {
    MyInput,
    MyCeshi
  }
}
</script>

<style scoped>

</style>